<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head >
    <!--css样式-->
    <div th:fragment="css">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
      <!--<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>-->
       <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css"/>-->
        <script src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget/autoload.js"></script>
        <link rel="stylesheet" href="../static/css/typo.css" th:href="@{/css/font-awesome.min.css}">
    <link rel="stylesheet" href="../static/css/typo.css" th:href="@{/css/typo.css}">
    <link rel="stylesheet" href="../static/css/me.css" th:href="@{/css/me.css}">
    <link rel="stylesheet" href="../static/lib/tocbot/tocbot.css" th:href="@{/lib/tocbot/tocbot.css}">
    <link rel="stylesheet" href="../static/css/animate.css" th:href="@{/css/animate.css}">
    <link rel="stylesheet" href="../static/lib/prism/prism.css" th:href="@{/lib/prism/prism.css}">

        <link rel="stylesheet" th:href="@{/css/background.css}">
    </div>
</head>
<body>

<!--导航栏-->
<nav class="ui inverted attached segment m-padded-tb-mini" th:fragment="topbar(n)">
    <div class="ui container">
        <div class="ui inverted secondary stackable menu">
            <h2 class="ui teal header item">Blog</h2>
            <a th:href="@{/toIndex}"  class=" m-item item m-mobile-hide" th:classappend="${n==1} ? 'active' "><i class="home icon"></i>首页</a>
            <a th:href="@{/toTypes/{id}(id=1)}" class=" m-item item m-mobile-hide" th:classappend="${n==2} ? 'active' "><i class="idea icon"></i>分类</a>
            <a th:href="@{/toTags/{id}(id=1)}" class=" m-item  item m-mobile-hide" th:classappend="${n==3} ? 'active' "><i class="tags icon"></i>标签</a>
            <a th:href="@{/toArchives}" class=" m-item  item m-mobile-hide" th:classappend="${n==4} ? 'active' "><i class="clone icon"></i>归档</a>
            <a th:href="@{/toAbout}" class=" m-item  item m-mobile-hide" th:classappend="${n==5} ? 'active' "><i class="address card icon"></i>关于站长</a>
            <div class="right m-item item m-mobile-hide">
                <form  name="search" th:action="@{/search}" target="_blank" method="get" >
                <div class="ui teal icon  inverted transparent input"  >
                    <input type="text" name="quarry" placeholder="Search...." th:value="${quarry}"  autocomplete="off" style="color: #00c4ff">
                    <i onclick="document.forms['search'].submit()" class="search link icon"></i>
                </div>
                </form>
            </div>
            <div class="right m-item m-mobile-hide menu">
                <div class="ui dropdown item">
                    <div th:if="${session.user ==null}">
                        <img th:src="@{/images/aoavatar.png}" alt="" class="ui avatar image">
                        <span style="color: #c790af;font-size: 15px" >未登录</span>
                    </div>
                    <div class="text" th:if="${session.user !=null}" >
                        <img src="../static/images/varter.jpg"   th:src="@{${session.user.getAvatar()}}" alt="" class="ui avatar image">
                        <span th:text="${session.user.nickname}" ></span>
                    </div>
                    <i class="dropdown icon"></i>
                    <div class="menu" >
                        <a th:href="@{/toLoginOut}" class="item" th:if="${#strings.isEmpty(session.user)}">账号登录</a>
                        <a th:href="@{/toBlogManage}" class=" item" th:if="${!#strings.isEmpty(session.user)}">博客总览</a>
                        <a th:href="@{/admin/toUpdatePassword}" class="item" th:if="${!#strings.isEmpty(session.user)}" >修改密码</a>
                        <a th:href="@{/toLoginOut}" class="item"  th:if="${!#strings.isEmpty(session.user)}">账号注销</a>


                    </div>
                </div>
            </div>
        </div>
    </div>
    <a href="#" class="ui menu toggle black icon  button  m-right-top m-mobile-show">
        <i class="sidebar icon"></i>
    </a>
</nav>
<!--admin导航栏-->
<nav th:fragment="menu(n)" class="ui inverted attached segment m-padded-tb-mini">
    <div class="ui container">
        <div class="ui inverted secondary stackable menu">
            <h2 class="ui teal header item">后台管理</h2>

            <a th:href="@{/admin/toBlogManage/{current}(current=1)}" class=" m-item item m-mobile-hide" th:classappend="${n==1}?'active'"><i class="home icon"></i>博客</a>
            <a th:href="@{/admin/toTypes/{current}(current=1)}" class=" m-item item m-mobile-hide" th:classappend="${n==2}?'active'"><i class="idea icon"></i>分类</a>
            <a th:href="@{/admin/toTags/{current}(current=1)}" class=" m-item  item m-mobile-hide" th:classappend="${n==3}?'active'"><i class="tags icon"></i>标签</a>
            <a th:href="@{/toIndex}" class=" m-item  item m-mobile-hide"><i class="rocket icon"></i>回到主页</a>
            <div class="right m-item m-mobile-hide menu">
                <div class="ui dropdown item">
                    <div class="text">
                        <img src="../../static/images/varter.jpg" th:src="@{${session.user.getAvatar()}}" alt="" class="ui avatar image">
                        <span th:text="${session.user.getNickname()}"></span>
                    </div>
                    <i class="dropdown icon"></i>
                    <div class="menu">
                        <a th:href="@{/admin/toUpdatePassword}" class="item"> <i class="ui pink eraser icon"></i>修改密码</a>
                        <a th:href="@{/toLogOut}" class="item"> <i class="ui green power off icon"></i>注销</a>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <a href="#" class="ui menu toggle black icon  button  m-right-top m-mobile-show">
        <i class="sidebar icon"></i>
    </a>
</nav>






<!--底部 footer-->
<footer class="ui inverted vertical  segment m-padded-tb-massive" th:fragment="footer">
    <div class="ui   center aligned container">
        <div class="ui inverted divided stackable grid">
            <div class="two wide column">
                <img src="../static/images/wechat.png"  th:src="@{/images/wechat.png}" class="ui rounded image" alt="" style="width: 110px" >
            </div>
            <div class="five wide column">
                <h4 class="ui inverted header m-opacity-mini">最近更新</h4>
                <div class="ui inverted link list m-text-thin m-text-spaced m-opacity-mini">
                    <a th:href="@{/search(quarry=安东尼经典语录)}" class="item">安东尼经典语录</a>
                    <a th:href="@{/search(quarry=时间字符串格式互换)}" class="item">时间字符串格式互换</a>
                    <a th:href="@{/search(quarry=注解与反射)}" class="item">注解与反射</a>
                </div>
            </div>
            <div class="four wide column">
                <h4 class="ui inverted header m-opacity-mini">联系我</h4>
                <div class="ui inverted link list m-text-thin m-text-spaced m-opacity-mini">
                    <a th:href="@{https://mail.qq.com/cgi-bin/frame_html?sid=vq10RBML2Gp-PGsK&r=c9c63fa74736401a5b5eca27c19498cc}" class="item "><i class="mail icon"></i>&nbsp;:1471305491@qq.com</a>
                    <a th:href="@{tencent://AddContact/?fromId=45&fromSubId=1&subcmd=all&uin=1471305491&website=www.qtxml.cn}" class="item"><i class="qq icon"></i>:1471305491</a>
                    <a href="#" class="item">&nbsp;&nbsp;<i class="wechat icon"></i>&nbsp;&nbsp;:17698556007</a>
                </div>
            </div>
            <div class="three wide column">
                <h4 class="ui inverted header m-opacity-mini">关于我</h4>
                <div class="ui inverted link list m-text-thin m-text-spaced m-opacity-mini">
                    <a href="#" class="item">篮 球</a>
                    <a href="#" class="item">游 戏 </a>
                    <a href="#" class="item">音 乐</a>
                </div>
            </div>
            <div class="two wide  column ">
                <img src="../static/images/Iplay.png"  th:src="@{/images/Iplay.png}" class="ui rounded image" alt=""   style="width: 110px ;">
            </div>

        </div>
        <div class="ui inverted section divider">

        </div>
        <br/>
        <div class="m-text-thin m-text-spaced m-opacity-minim"> 京公网安备11000002000001号&nbsp;&nbsp;京ICP证030173号©2021&nbsp;&nbsp;

        </div>
    </div>

</footer>
</body>
</html>